<div id="mensagem" style="display: none;"></div>
<div class="wrapper wrapper-content animated fadeIn">
	<div class="row">
		<div class="col-lg-12">
			<div class="ibox float-e-margins">
				<div class="ibox-title">
					<h5>Editar Profile</h5>
				</div>
				<div class="ibox-content">
					<div class="row">
						<div class="col-lg-12">
							<!-- left column -->
							<div class="col-lg-3 text-center" title="Alterar Foto">
								<div class="avatar-view">
							      	<img id="profile-foto" alt="Foto" src="<?= @$foto; ?>" style="position: relative; top: 50%; transform: translateY(-50%);" class="img-thumbnail">
								</div>
						    </div>
						    
						    <form id="formProfile" class="form-horizontal" method="post" accept-charset="UTF-8">
							
								<!-- edit form column -->
								<div class="col-md-9">
									<div class="form-group">
										<label class="col-lg-3 control-label">Nome:</label>
										<div class="col-lg-8">
										  <input class="form-control" type="text" id="nome" name="nome" value="<?= @$pessoa->nome; ?>">
										</div>
									</div>
									<div class="form-group" id="data-calendario">
										<label class="col-lg-3 control-label">Data Nascimento:</label>
                               			<div class="col-lg-8 input-group date">
                                    		<input class="form-control" type="text" id="dataNascimento" name="dataNascimento" readonly="readonly" value="<?= mostraData(@$pessoa->dtNascimento); ?>">
                                			<span class="input-group-addon" style="cursor: pointer;">
                                    			<i class="fa fa-calendar"></i>
                                    		</span>
                                		</div>
                                	</div>
									<div class="form-group">
										<label class="col-lg-3 control-label">CPF:</label>
										<div class="col-lg-8">
											<input class="form-control" type="text" id="cpf" name="cpf" value="<?= @$pessoa->cpf; ?>">
										</div>
									</div>
									<div class="form-group">
										<label class="col-lg-3 control-label">Email:</label>
										<div class="col-lg-8">
											<input class="form-control" type="email" id="email" name="email" value="<?= @$usuario->email; ?>">
										</div>
									</div>
									<div class="form-group">
										<label class="col-lg-3 control-label">Telefone:</label>
										<div class="col-lg-8">
											<input class="form-control" type="text" id="telefone" name="telefone" value="<?= @$pessoa->telefone; ?>">
										</div>
									</div>
									<div class="form-group">
										<label class="col-lg-3 control-label">Celular:</label>
										<div class="col-lg-8">
											<input class="form-control" type="text" id="celular" name="celular" value="<?= @$pessoa->celular; ?>">
										</div>
									</div>
									<div class="form-group">
										<label class="col-lg-3 control-label">Login:</label>
										<div class="col-lg-8">
											<input class="form-control" type="text" id="login" name="login" value="<?= @$usuario->login; ?>">
										</div>
									</div>
								</div>
							
								<div class="col-md-12 text-center m-t-lg">
									<button type="button" class="btn btn-default" id="buttonVoltar">
										<i class="fa fa-mail-reply"></i>&nbsp;&nbsp;Voltar
									</button>
									<button type="submit" class="btn btn-primary" id="buttonSalvar">
										<i class="fa fa-save"></i>&nbsp;&nbsp;Salvar
									</button>			
								</div>
							</form>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>

<!-- Cropping modal -->
<div class="modal inmodal" id="avatar-modal" tabindex="-1" role="dialog"  aria-hidden="true">
	<div class="modal-dialog modal-lg">
		<div class="modal-content animated fadeIn">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
				<h4 class="modal-title">Alterar Foto</h4>
			</div>
			
			<div id="mensagemModal" style="display: none;"></div>
			
			<form class="avatar-form" class="form-horizontal" action="<?= base_url(); ?>admin/profile/uploadAvatar" enctype="multipart/form-data" method="post">
				<div class="modal-body">
					<div class="avatar-body">

						<!-- Crop and preview -->
						<div class="row">
							<div class="col-md-8">
								<div class="avatar-wrapper"></div>
							</div>
							
							<div class="col-md-4 text-center">
								<div class="avatar-preview preview-lg"></div>
								
								<div class="input-group avatar-btns">
									<button class="btn btn-white col-md-6" id="zoomIn" type="button" data-method="zoom" data-option="0.1">Zoom In</button>
									<button class="btn btn-white col-md-6" id="zoomOut" type="button" data-method="zoom" data-option="-0.1">Zoom Out</button>
								</div>
								
								<div class="input-group">
									<label for="dataWidth" class="input-group-addon" style="width: 27%;">Width</label>
									<input type="text" placeholder="width" id="dataWidth" class="form-control" disabled="disabled" > 
									<span class="input-group-addon">px</span>
								</div>
								<div class="input-group">
									<label class="input-group-addon" for="dataHeight" style="width: 27%;">Height</label>
						            <input class="form-control" id="dataHeight" type="text" placeholder="height" disabled="disabled" >
						            <span class="input-group-addon">px</span>
								</div>
							</div>
						</div>

						<div class="row">
							<div class="col-md-12">
								<div class="btn-group avatar-upload">
									<input class="avatar-src" name="avatar_src" type="hidden">
									<input class="avatar-data" name="avatar_data" type="hidden">
									<input type="file" accept="image/*" class="avatar-input" id="avatarInput" name="userfile">
								</div>
							</div>
						</div>
					</div>
				</div>	
				<div class="modal-footer">
					<button type="button" class="btn btn-default" id="buttonCancelarModal" data-dismiss="modal" style="float: left;">
						<i class="fa fa-times"></i>&nbsp;&nbsp;Cancelar
					</button>
					<button type="submit" class="btn btn-primary avatar-save" id="buttonSalvarModal">
						<i class="fa fa-save"></i>&nbsp;&nbsp;Salvar
					</button>
				</div>			
			</form>
		</div>
	</div>
</div><!-- /.modal -->
